<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>评价</title>
    <!--公用样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/comment.css"/>
    <!--页面样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/style.css"/>
    <!--Layui-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>
<#--    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/layui.css"/>-->
    <!--页面样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/extended.css"/>
    <!--JQ-->
    <script type="text/javascript" charset="utf-8"
            src="${re.contextPath}/plugin/common/js/jquery-1.8.3.min.js"></script>
    <!--Layui-->
    <script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.all.js" charset="utf-8"></script>
    <!--公用样式JS-->
    <script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/comment.js"></script>
    <!--进度条-->
    <style>
        .layui-table-cell{
            /*height:40px;*/
            /*line-height: 40px;*/
            /*overflow:visible;*/
            /*text-overflow:inherit;*/
            /*white-space:normal;*/
            /*height: auto !important;*/
            /*word-break: break-all;*/
        }
        .layui-table thead tr{
            background-color: #F1F4Fb!important;
        }
        .tableSelectBar>.layui-form input{
            display: none!important;
        }
        .tableSelectBar>.layui-form button{
            display: none!important;
        }
        .popUpBox table, .contract table {
            width: 98%;
            border: 1px solid #CCCCCC;
            margin-left: 13px;
        }
        .layui-rate li i.layui-icon {
            font-size: 46px;
        }
    </style>
</head>

<body style="background-color: #fff">

<!--容器-->
<div class="container">
    <div class="layui-row env-title bold"><h2>评价业主单位</h2></div>
    <div class="layui-row env-content" style="text-align: center">
        <span class="env-content-span" style="color: red">五星表示很满意；四星代表比较满意；三星代表一般；二星代表较差；一星代表非常差</span>
    </div>
    <div class="layui-row h25"></div>
    <div class="popUpBox acceptance">
        <table>
            <tr>
                <td>星评：</td>
                <td><div id="test1" lay-filter="table-eval"></div></td>
            </tr>
            <tr>
                <td>对业主的建议或意见：</td>
                <td><textarea id="opinion"></textarea></td>
            </tr>
        </table>

    </div>
    <div class="layui-row">
        <div class="layui-col-md1 layui-col-md-offset5">
            <input class="layui-btn layui-btn-primary" type="button" value="关闭" onclick="clos()">
        </div>
        <div class="layui-col-md1">
            <input class="layui-btn layui-btn-normal" type="button" value="提交" onclick="sub()">
        </div>
    </div>
    <br>
</div>
    <script type="text/javascript" src="${re.contextPath}/pageoffice.js" id="po_js_main"></script>
    <script type="text/html" id="titleTpl">
        <span badtNo="{{d.badtNo}}">{{d.badtName}}</span>
    </script>
<script>

    var table,element,layer,tableIns,rate;
    layui.use(['table','rate'], function () {
        table = layui.table, element = layui.element,layer = layui.layer,rate = layui.rate;;
        var evadata = JSON.parse(localStorage.getItem("evadata"));
        //方法级渲染
        tableIns = table.render({
            elem: '#table-eval',
            height: '300',
            where: {
                'spId': evadata.spId,
                'source': evadata.source,
                'aindex': evadata.aindex
            },
            url: '/jc/projectManager/eFormData',
            cols: [[
                    {field: 'badtName', title: '', width: '24%', align: 'left',templet: '#titleTpl',rowspan: 2},
                    {field: 'score1', title: '很满意', width: '14%', align: 'center',edit:'text',event:'ck'},
                    {field: 'score2', title: '满意', width: '14%', align: 'center',edit:'text',event:'ck'},
                    {field: 'score3', title: '基本满意', width: '14%', align: 'center',edit:'text',event:'ck'},
                    {field: 'score4', title: '不满意', width: '14%', align: 'center',edit:'text',event:'ck'},
                    {field: 'remark', title: '备注',width: '20%', align: 'center',edit:'text',rowspan: 2}
                ],
                [
                    // {title: '', width: '24%', align: 'left'},
                    {title: '90-100', width: '14%', align: 'center'},
                    {title: '80-89', width: '14%', align: 'center'},
                    {title: '60-79', width: '14%', align: 'center'},
                    {title: '0-59', width: '14%', align: 'center'},
                    // {title: '备注', width: '18%', align: 'center'}
                ]
            ],
            page: false,
            done: function(res,curr,count){
                //去掉因为双表头出现的多余的列
                $(".layui-table-body").find("td").each(function(index,element){
                    if( $(this).attr('data-field')*1 > 5){
                        // $(this).css("display","none");
                        $(this).remove();
                    }
                })
                //最后一行合并单元格
                $(".layui-table-body").find("tr:last").each(function(index,element){
                    $(this).css('height','100px')
                    $.each($(this).find('td'),function(e,o){
                        if(e == 1){
                            $(o).attr('colspan','5');
                            $(o).removeAttr('lay-event');
                            $(o).attr('data-field','opiniona');
                            $(o).attr('id','opinionaDiv');
                            $(o).css('align','left');
                            $(o).find('div').css('width',($(o).find('div')[0].clientWidth)*5+'px');
                            $(o).find('div').css('text-align','left');
                        }
                        if(e > 1){
                            $(o).remove();
                        }
                    })
                });

                //左上角的图片:
                <#--var firstTh = $('th[data-field="badtName"]');-->
                <#--firstTh.css("padding","0px");-->
                <#--firstTh.find('div').css("padding","0px");-->
                <#--firstTh.find('div').html('<img src="${re.contextPath}/plugin/common/images/td.png" style="max-width:none !important;width:100%;height:200%">')-->
            }
        });
        //星评
        rate.render({
            elem: '#test1'
            ,theme: '#f00'
            ,text:true
            ,setText: function(value){ //自定义文本的回调
                var arrs = {
                    '1': '20'
                    ,'2': '40'
                    ,'3': '60'
                    ,'4': '80'
                    ,'5': '100'
                };
                this.span.text(arrs[value] || ( value));
            }
        })
        //监听单元格编辑   计算分数:
        table.on('edit(table-eval)', function(obj){
            var value = obj.value //得到修改后的值
                ,data = obj.data //得到所在行所有键值
                ,field = obj.field//得到字段
                ,tr = obj.tr;

            if(field.indexOf('score') != -1){

                var selector = obj.tr.selector+' td[data-field="'+field+'"] div';
                var oldtext = $(selector).text();
                //判断数据类型
                if(isNaN(obj.value)) {
                    layer.msg("请输入数字",{icon:2});
                    $(obj.tr.selector + ' td[data-field="' + field + '"] input').val(oldtext);
                }else{
                    if(checkArea(field,value) != '1'){
                        layer.msg("请输入符合范围的数字",{icon:2});
                        $(obj.tr.selector + ' td[data-field="' + field + '"] input').val(oldtext);
                        return ;
                    }else{
                        if(value.indexOf(".") != -1){
                            var pointInd = (value.indexOf("."))*1;
                            var newValue = value.substr(0,pointInd+3);
                            $(obj.tr.selector + ' td[data-field="' + field + '"] input').val(newValue);
                        }
                    };
                    calScore();
                }
            }

            if(field == 'opiniona'){
                if(value.length > 100){
                    layer.msg("只能输入100字",{icon:2});
                    var currVal = value.substr(0,100);
                    $(obj.tr.selector + ' td[data-field="' + field + '"] input').val(currVal);
                }
            }

            if(field == 'remark'){
                if(value.length > 30){
                    layer.msg("只能输入30字",{icon:2});
                    var currVal = value.substr(0,30);
                    $(obj.tr.selector + ' td[data-field="' + field + '"] input').val(currVal);
                }
            }



        });

        table.on('tool(table-eval)', function(obj){
            var that = $(this);
            if(obj.event == 'ck'){
                $($(obj)[0].tr[0]).find('td[lay-event]').each(function(e,b){
                    if(that.attr('data-key') != $(b).attr('data-key')){
                        var field = $(b).attr('data-field');
                        console.log(field)
                        obj[field] = '';
                        // obj.update({
                        //     [field]: ""
                        // });
                    }
                })
                calScore();
            }
        });

        function checkArea(field,value){
            var min = 0,max = 100;
            if(field == 'score1'){
                min = 90;
            }else if(field == 'score2'){
                min = 80;
                max = 89;
            }else if(field == 'score3'){
                min = 60;
                max = 79;
            }else if(field == 'score4'){
                max = 59;
            }
            if(value*1 >= min && value*1 <= max){
                return '1';
            }
            return '0';
        }

        function calScore(){
            setTimeout(function(){
                var tds = $("td[lay-event]");
                var a = 0;
                var total = 0;
                $.each(tds,function(e,o){
                    var value = $(o).text();
                    if(value){

                        a++;
                        total = total + (value*1)
                    }
                })
                if(total && total != 0 && a!= 0){
                    $("#total-score").text((total/a).toFixed(2));
                }
                if(total == 0){
                    $("#total-score").text(0);
                }
            },500);
        }
    });

    function sub(){
        var fs=$("#test1").text();
        var yj=$("#opinion").val();
        if(!fs||fs=='0'){
            layer.msg('评价后才能提交',{icon: 2});
            return ;
        }
        var sendData={};
        var evadata = JSON.parse(localStorage.getItem("evadata"));
        sendData.spId = evadata.spId;
        sendData.source = evadata.source;
        sendData.aindex = evadata.aindex;
        sendData.speOpinion = yj;
        sendData.score = fs;
        $.ajax({
            url: '/jc/projectManager/insertEvaluation',
            data: JSON.stringify(sendData),
            type: 'post',
            contentType:"application/json;",
            dataType: 'json',
            success: function(res){
                if(res.flag){
                    var bfcid = '';
                    if(res.data.source == '003' || (res.data.source == '001' && res.data.aindex == '1')){
                        bfcid = '50018'
                    }else if(res.data.source == '001' && res.data.aindex == '2'){
                        bfcid = '50019'
                    }else if(res.data.source == '001' && res.data.aindex == '3'){
                        bfcid = '50020'
                    }
                    if(res.data){
                        POBrowser.openWindowModeless('/jc/office/openword?ft=4&speid='+res.data.speId+'&source='+res.data.source+'&aindex='+res.data.aindex+',&spid='+res.data.spId+'&bfcid='+bfcid+'&fpid='+bfcid,'width=1200px;height=800px;','{}')
                        checkUpdate();
                    }
                }else{
                    layer.msg(res.msg,{icon: 2});
                }
            },
            error: function(res){
                console.log(res);
            }
        })
    }

    function checkUpdate(){
            clos();
    }

    function clos(){
        var index =parent.layer.getFrameIndex(window.name);
        parent.layer.close(index);
    }
</script>
</body>
</html>